<!DOCTYPE html>
<html>
<head>
    <title>bTabs以多标签页载入页面的功能插件</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../lib/bootstrap/3.3.7/css/bootstrap.min.css" />
    <link rel="stylesheet" href="../lib/font-awesome-4/css/font-awesome.min.css" />
    
    <link rel="stylesheet" href="../css/btabs/header.css" />
    <link rel="stylesheet" href="../css/btabs/index.css" />
</head>

<body>
    <header class="navbar navbar-static-top" id="top">
    <div class="container">
        <div class="navbar-header">
            <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#bs-navbar" aria-controls="bs-navbar" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="https://terryz.github.io/btabs/index.html" class="navbar-brand">bTabs</a>
        </div>
        <nav id="bs-navbar" class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li>
                    <a href="guide.html" >入门</a>
                </li>
                <li>
                    <a href="demo.html" >实例</a>
                </li>
                <li>
                    <a href="docs.html" >文档</a>
                </li>
                <li>
                    <a href="changelog.html" >更新记录</a>
                </li>
                <li>
                    <a href="message.html" >留言/反馈</a>
                </li>
                <li>
                    <a href="https://terryz.github.io" >主页</a>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="https://github.com/TerryZ/bTabs" target="_blank"><i class="fa fa-lg fa-github"></i> Fork on Github</a></li>
            </ul>
        </nav>
    </div>
    </header>

	<div class="headerBox">
		<div class="container">
			<div class="row headerArea">
				<div class="jumbotron col-md-10 text-left">
					<h1>以多标签页载入页面的功能插件</h1>
					<p>通过简单配置即可让页面变为Ext、EasyUI之类多标签页模式，丰富业务展示模式</p>
                    <p>
                        <iframe src="https://ghbtns.com/github-btn.html?user=TerryZ&repo=bTabs&type=star&count=true" frameborder="0" scrolling="0" width="90px" height="20px"></iframe>
                        <iframe src="https://ghbtns.com/github-btn.html?user=TerryZ&repo=bTabs&type=fork&count=true" frameborder="0" scrolling="0" width="80px" height="20px"></iframe>
                    </p>
					<p>						
						<a class="btn btn-default btn-lg" href="https://github.com/TerryZ/bTabs" role="button">下载插件</a>
						<a class="btn btn-default btn-lg" href="message.html" role="button">留言/反馈</a>
                        <a class="btn btn-default btn-lg" href="https://github.com/TerryZ/bTabs" target="_blank" role="button"><i class="fa fa-star"></i> 给项目加个Star，支持项目</a>
					</p>
				</div>
			</div>
		</div>
	</div>


	<div class="container">
		<div class="row text-center">
			<img alt="效果图" src="../image/bTabs.png">
		</div>
	</div>


    <div class="content">
        <div class="container">
			<div class="row" style="margin-top: 50px;">
                <div class="col-md-6">
                    <h3><i class="fa fa-flag"></i> jQuery、Bootstrap</h3>
                    <p class="desc">基于jQuery开发，可方便地使用于Bootstrap2、Bootstrap3环境中</p>
                </div>
                <div class="col-md-6">
                    <h3><i class="fa fa-commenting-o"></i> 参数设置</h3>
                    <p class="desc">设置初始化参数以完善标签页框架</p>
                </div>
            </div>
            
            <div class="row">
                <div class="col-md-6">
                    <h3><i class="fa fa-tachometer "></i> 自定义皮肤</h3>
                    <p class="desc">在需要使用不同样式的皮肤时，只需要定义好皮肤的样式内容，插件可在初始化时，设置指定的皮肤名称</p>
                </div>
                <div class="col-md-6">
                    <h3><i class="fa fa-file-text-o"></i> 多标签页</h3>
                    <p class="desc">使用导航或其他方式打开多个标签页内容时，每个标签页都拥有独立的上下文，内容、对象互相不干扰</p>
                </div>
            </div>
        </div>
    </div>


    <footer class="footer">
        <div class="container">
        Copyright © 2016-2017 Terry Zeng
        </div>
    </footer>
<script type="text/javascript" src="../js/count.js" ></script>
</body>
</html>